import React,{useEffect,useState} from 'react';
import { connect,history } from 'umi';
import { PageContainer } from '@ant-design/pro-layout';
import { Card } from 'antd';
import HistoryPop from '@/components/HistoryPop';
const index = (props) => {
  const [checkedIndex, setcheckedIndex] = useState();
  const { routerHistoryList=[] } = props;
  const preventDefault = (current)=>{
    props.dispatch({
      type:"global/delRouterHistory",
      payload:current
    })
  }
  useEffect(()=>{ 
    const currentPathName = history.location.pathname;
    if(routerHistoryList.length){
      const index = routerHistoryList.findIndex(item=>item.path==currentPathName);
      if(index!=-1)setcheckedIndex(index)
    }
  },[])
  return (
    <>
      <PageContainer>
        <HistoryPop routerList={routerHistoryList} checkedIndex={checkedIndex} preventDefault={preventDefault}></HistoryPop>
        <Card bordered={false} style={{ width: '100%', minHeight: '75%' }}>
        {
          props.children
        }
        </Card>
      </PageContainer>
    </>
  );
};

export default connect((state)=>state.global)(index);
